﻿@{
    Layout = null;

    var pageModel = ViewBag.pageModel as NB.MGJ.Model.AntiFake.AntiFake_PageCreate;
    var type = ViewBag.type;
    var code = ViewBag.code;
}
@Content.Script(Url, "AntiFake/CreateAntiFakePage.js")
<script src="~/Scripts/Home/swiper.js"></script>
<script src="~/Scripts/MGJJS/TraceSource/PageOperation/UEditor/ueditor.config.js"></script>
<script src="~/Scripts/MGJJS/TraceSource/PageOperation/UEditor/ueditor.all.js"></script>
<script src="~/Scripts/MGJJS/TraceSource/PageOperation/UEditor/lang/zh-cn/zh-cn.js"></script>
<script src="~/Content/CommonCss/jqueryUI/jquery-ui.js"></script>
@*<script src="~/Scripts/WebUploader/webuploader.js"></script>
<link href="~/Scripts/WebUploader/webuploader.css" rel="stylesheet" />*@
<link href="~/Content/HomePage/swiper.min.css" rel="stylesheet" />
<link href="~/Content/CommonCss/jqueryUI/jquery-ui.css" rel="stylesheet" />
@*引入vue.js*@
<script src="~/Scripts/MGJJS/Market/vue.js"></script>
@*微页面创建*@
<style>
    .padding15 {
        padding: 15px 20px;
        background: #F0F4F5;
    }

    p {
        margin: 0;
    }

    .picker input[type='file'] {
        opacity: 0;
    }

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
        color: #fff;
        background-color: #50AE55;
        border-color: transparent;
    }

    .myTabs.nav-tabs > li.active > a, .myTabs.nav-tabs > li.active > a:focus, .myTabs.nav-tabs > li.active > a:hover {
        color: #50AE55;
        cursor: default;
        background-color: #fff;
        border-bottom: 4px solid #ddd;
        border-bottom-color: #50AE55;
    }

    .con {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        padding: 15px 10px;
        background: white;
    }

        .con .left-con {
            width: 350px;
            min-height: 650px;
            background: url('/Content/webImgs/Market/redPacket/phone.png');
            background-size: 100% 100%;
            position: relative;
            box-shadow: 3px 0 10px #a29a9a;
            border-radius: 6px;
        }

        .con .left-con #phone {
            width: 92.7%;
            height: 78%;
            position: absolute;
            top: 14.3%;
            left: 3%;
            background-size: 100% 100%;
            background-repeat: no-repeat;
        }

        .con .left-con #phone .tab-content {
            height: 100%;
            width: 100%;
            position: absolute;
        }

        .con .left-con #phone .tab-content .phoneView {
            width: 100%;
            height: 100%;
            position: absolute;
            box-sizing: content-box;
            overflow:hidden;
        }

        .con .right-con {
            flex: 1;
            margin-left: 15px;
            /*background: yellow;*/
            min-height: 500px;
        }

    .pageTitle {
        text-align: center;
        height: 30px;
        line-height: 30px;
        top: -30px;
        position: absolute;
        width: 100%;
        color: white;
    }



    .draggable:hover {
        cursor: move;
    }

    .resizable:hover {
        border: dashed 1px #4DA4DF;
        cursor: move;
    }

    .EnterpriseLogo {
        position: absolute;
        top: 1%;
        left: 6%;
        width: 40px;
        height: 40px;
        border-radius: 4px;
        z-index: 100;
        display: flex;
        align-items: center;
    }


    #Award-Record {
        position: absolute;
        top: 1%;
        right: 3%;
        border: none;
    }

    #Rules {
        position: absolute;
        top: 1%;
        right: 30%;
        border: none;
    }

    .title {
        position: absolute;
        top: 10%;
        width: 100%;
        height: 140px;
        display: flex;
        justify-content: center;
    }

    .middle {
        position: absolute;
        top: 30%;
        width: 100%;
        height: 200px;
    }

    .clickRequest {
        position: absolute;
        bottom: 20%;
        left: 10%;
        width: 80%;
        height: 35px;
        line-height: 35px;
        text-align: center;
        background-color: #F9BF26;
        border-radius: 20px;
        color: #763401;
        font-weight: 700;
        border: none;
    }

    .confirm {
        position: absolute;
        bottom: 22%;
        height: 60px;
        width: 140px;
        left: 50%;
        margin-left: -70px;
    }

    a.surport {
        position: absolute;
        bottom: 0;
        right: 0;
        left: 0;
        margin: 0 auto;
        width: 100%;
        display: block;
        text-align: center;
        color: #999;
        border: none;
        font-size: 12px;
    }


    .roasting {
        width: 80%;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 5%;
        margin: 0 auto;
        background-color: rgba(255,255,255,0.2);
        border-radius: 4px;
        padding: 5px 0;
        height: 65px;
        color: white;
    }

        .roasting > ul {
            margin-bottom: 0;
        }

            .roasting > ul > li {
                display: flex;
                justify-content: space-around;
                align-items: center;
                font-size: 12px;
            }

                .roasting > ul > li span:nth-child(1) {
                    margin-left: 5px;
                }

                .roasting > ul > li span:nth-child(2) {
                    margin-right: 5px;
                    margin-left: 5px;
                }

                .roasting > ul > li span:nth-child(3) {
                    margin-right: 5px;
                }


    ul.my-award li {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #CCCCCC;
        border-bottom: 2px solid #CCCCCC;
        padding: 10px;
    }

        ul.my-award li > div:nth-child(1) > div:nth-child(1) {
            color: #444;
        }

        ul.my-award li > div:nth-child(1) > div:nth-child(2) {
            color: #999;
        }

    #ChangeImg {
        display: none;
    }

    #ModalImg {
        height: 80px;
        width: 80px;
        margin: 0 auto;
    }

    .bg-con .insert {
        position: absolute;
        width: 72%;
        height: 60%;
        left: 14%;
        top: 20%;
    }

        .bg-con .insert .awardInfo {
            position: relative;
            height: 65%;
        }

            .bg-con .insert .awardInfo > img {
                position: absolute;
                width: 100%;
                height: 100%;
            }

            .bg-con .insert .awardInfo > p {
                position: absolute;
                text-align: center;
                bottom: 5px;
                width: 100%;
                color: whitesmoke;
            }

        .bg-con .insert .btn {
            background: #F7C331 !important;
            color: #7D3802;
            border: none;
            padding: 4px 12px;
            font-size: 14px;
            line-height: 1.6;
            border-radius: 3px;
            text-align: center;
        }

        .bg-con .insert .btn-block {
            display: block;
        }

        .bg-con .insert .rule-title {
            text-align: center;
            margin: 10Px 0;
        }

        .bg-con .insert .rule-content {
            overflow: auto;
            padding: 0 0 0 8px;
            height: 78%;
        }

    .award-details {
        width: 100%;
        height: 100%;
        background: #f2f2f2;
    }

        .award-details .award-head {
            background: #CB0101;
            text-align: center;
            color: white;
            padding: 0 0 10px;
        }

            .award-details .award-head p:nth-child(1) {
                text-align: left;
            }

        .award-details .award-body {
            background: white;
            text-align: center;
            padding: 10px 0;
        }

        .award-details .award-details-list {
            display: flex;
            align-items: center;
            padding-bottom: 5px;
            border-bottom: dashed 1px #E0E0E0;
            background: white;
        }


            .award-details .award-details-list span:nth-child(1) {
                margin-left: 5px;
            }

            .award-details .award-details-list span:nth-child(2) {
                margin-right: 5px;
                margin-left: 5px;
            }

            .award-details .award-details-list span:nth-child(3) {
                margin-right: 5px;
            }

    .phone {
        width: 100%;
        height: 100%;
        background: url("https://15448716.h40.faiusr.com/2/7/ACgIABACGAAgqdaD0QUooc7ujQUw0AU4gAo.jpg");
        background-size: 100% 100%;
        padding: 0 5%;
    }

    .phone > p:nth-child(1) {
        color: #E29F7B;
        padding-top: 10px;
        font-size: 18px;
    }

    .phone > p:nth-child(2) {
        color: #E29F7B;
        margin: 5px 0 10px;
    }

    .phone .phone-num {
        display: flex;
        align-items: center;
        background-color: white;
        border-radius: 3px;
        margin-bottom: 10px;
    }

    .phone .phone-num > span {
        padding: 5px;
    }

    .phone .phone-num > input {
        border: none;
        height: 100%;
        width: 100%;
        border-radius: 3px;
        height: 30px;
        line-height: 30px;
    }

    .phone .sure {
        display: block;
        text-decoration: none;
        background-color: #FFCC00;
        text-align: center;
        height: 35px;
        color: #763401;
        line-height: 35px;
        border-radius: 4px;
        margin: 20px auto;
    }

    .phone .user-info {
        border: 1px solid #d7d7d7;
        border-radius: 6px;
        width: 100%;
        height: 100px;
        overflow: hidden;
    }

    .phone .user-info > ul {
        margin: 0;
        padding: 0;
    }

    .phone .user-info > ul > li {
        display: flex;
        margin: 10px auto 20px;
        align-items: center;
    }

    .phone .user-info > ul > li > img {
        width: 35px;
        height: 35px;
        border-radius: 40px;
        margin-left: 10px;
    }

    .phone .user-info > ul > li > span {
        color: white;
    }


    .phone .user-info > ul > li > span:nth-child(2) {
        width: 60px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }



    .winnerName {
        position: absolute;
        bottom: 3%;
        color: #d7d7d7;
        width: 100%;
    }

        .winnerName .winnerCon {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }


    .red-con {
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        position: absolute;
    }

    .bg-con {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        background-color: rgba(0,0,0,.85);
        display: none;
        z-index: 100;
    }

        .bg-con .small-bg {
            width: 100%;
            height: 50%;
            position: absolute;
            left: 0;
            /*bottom: -50%;*/
            bottom: 0;
            background: url("https://15448716.h40.faiusr.com/4/7/ACgIABAEGAAguMqQ0QUo0cnLigUw0AU4_AQ.png");
            background-size: 100% 100%;
            z-index: 10;
        }

            .bg-con .small-bg > p:nth-child(1) {
                text-align: center;
                color: #FBCE02;
                margin: 10px auto 0;
            }

    .red-con .bg-con .small-bg > p:nth-child(1) > span {
        color: #FBCE02;
        font-size: 30px;
        font-weight: 600;
        text-align: center;
    }

    .bg-con .small-bg > p:nth-child(2) {
        text-align: center;
        color: whitesmoke;
        font-size: 20px;
    }

    .bg-con .small-bg > p:nth-child(3) {
        text-align: center;
        color: whitesmoke;
        font-size: 16px;
    }

    .bg-con .small-bg > a.add {
        display: block;
        text-decoration: none;
        width: 80%;
        height: 35px;
        line-height: 35px;
        text-align: center;
        background-color: #FFCC00;
        border-radius: 20px;
        color: #763401;
        font-weight: 700;
        position: absolute;
        bottom: 10px;
        left: 0;
        right: 0;
        margin: 0 auto;
    }

    #TopSwpier {
        height: 40%;
    }

    #TopImg {
        display: none;
    }

        #top_img, #TopImg, #TopImg > img {
            height: 100%;
        }

    #btn1 {
        bottom: 0;
        display:none;
    }

    #icon img {
        display: block;
        height: 40px;
        width: 40px;
        margin: 0 auto;
    }

    #icon span {
        display: flex;
        justify-content: center;
    }

    .space-between {
        display: flex;
        justify-content: space-between;
    }

    .PaddingRow {
        padding: 0 15px;
    }

    #phoneForm .row {
        margin: 0;
    }

    #AntiFakeInp .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
        background-color: #FFF;
    }


    /************************文件上传****************************/
    .upload_warp_img_div_del {
        position: absolute;
        top: 6px;
        width: 16px;
        right: 4px;
    }

    .upload_warp_img_div_top {
        position: absolute;
        top: 0;
        width: 80px;
        height: 30px;
        background-color: rgba(0, 0, 0, 0.4);
        line-height: 30px;
        text-align: left;
        color: #fff;
        font-size: 12px;
        text-indent: 4px;
        z-index: 100;
    }

    .upload_warp_img_div_text {
        width: 80px;
        height: 80px;
    }

        .upload_warp_img_div_text > img {
            width: 100%;
        }

    .upload_warp_img_div img {
        max-width: 100%;
        max-height: 100%;
        vertical-align: middle;
    }

    .upload_warp_img_div {
        position: relative;
        height: 80px;
        width: 80px;
        border: 1px solid #ccc;
        margin-right: 10px;
        float: left;
        line-height: 80px;
        display: table-cell;
        text-align: center;
        background-color: #eee;
        cursor: pointer;
    }

    .upload_warp_text {
        text-align: left;
        margin-bottom: 10px;
        padding-top: 10px;
        font-size: 14px;
    }

    .upload_warp_right {
        float: left;
        width: 80%;
        margin-left: 2%;
        height: 80px;
        line-height: 130px;
        color: #999;
    }

    .upload_warp_left {
        width: 80px;
        height: 80px;
        border: 1px dashed #999;
        border-radius: 4px;
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
    }

    .upload_warp_left > div:nth-child(2) {
        height: 100% !important;
        width: 100% !important;
    }

    .upload_warp_left input {
        opacity: 0;
    }

    .upload_warp {
        display: flex;
        align-items: center;
    }

    .upload {
        background-color: #fff;
    }

    .hello {
        text-align: center;
    }


    .rightForm {
        border-radius: 4px;
        border: 2px solid #e5e5e5;
        display: none;
    }

    .titleCss {
        text-indent: 1em;
        font-size: 20px;
        padding: 10px;
        background: #F5F5F5;
        color: #444;
    }
    .titleX {
        color: #999;
        float: right;
        margin-right: 10px;
        cursor: pointer;
    }
     .HoverImg {
        background-size: 100% 100% !important;
        background-repeat: no-repeat !important;
    }

    #Icon0list img, #Icon1list img, #Icon2list img, #Icon3list img {
        width: 40px;
        height: 40px;
    }

    #DragImg_Web img, #thelist img {
        width: 91px;
        height: 91px;
    }
    
    #DragImgUiBox {
        display: block;
        width: 60px;
        position: absolute;
        z-index: 9;
    }
    #DragImg{
        width:100%;
        height:100%
    }
    #DragImgHideBox {
        width: 34px;
        height: 34px;
        background: green;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 9;
        text-align: center;
        line-height: 17px;
        color:#FFF;
        display:none;
    }
</style>
@*设置挂载点*@
<div class="padding15" id="app">

    <div class="con">
        <div class="left-con">
            <div class="input-hidden-con">
                <input type="hidden" name="ActivityType" value="2" />
                <input type="hidden" id="TemId" />
            </div>
            <div id="phone">
                <div class="tab-content">
                    <div id="red1" class="in phoneView red-con" onclick="ChangeBackground()">
                        <p class="pageTitle"  onclick="ShowTitle()">标题</p>
              
                        <div id="TopSwpier" style="background:#E5E5E5;" onclick="ShowTopSwpier()">
                            <div id="DragImgUiBox" class="ui-widget-content resizable draggable" onclick="ShowDragImg()">
                                <img id="DragImg" src="~/Content/CommonCss/miniui/themes/ext/images/index_48.jpg" />
                            </div>
                            <div id="DragImgHideBox" value="1" onclick="ShowDragImg()">拖拽图</div>
                            <div id="top_img" class="swiper-container">
                                <div id="_top_img" class="swiper-wrapper">
                                    @*<img class="swiper-slide" src="~/Scripts/MGJJS/TraceSource/PageOperation/UEditor/dialogs/image/images/alignicon.jpg" />
                                        <img class="swiper-slide" src="~/Scripts/MGJJS/TraceSource/PageOperation/UEditor/dialogs/image/images/alignicon.jpg" />
                                        <img class="swiper-slide" src="~/Scripts/MGJJS/TraceSource/PageOperation/UEditor/dialogs/image/images/alignicon.jpg" />*@
                                    <img class="swiper-slide SwpierDefaultImage" src="~/Scripts/MGJJS/TraceSource/PageOperation/UEditor/dialogs/image/images/alignicon.jpg" />
                                </div>
                                <div id="btn1" class="swiper-pagination"></div>
                            </div>
                        </div>
                        <div id="icon" class="space-between PaddingRow padding-top-15">
                            <div onclick="ShowIcon(this)" id="1" class="IconBox">
                                <img src="~/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png" />
                                <span>溯源</span>
                               
                            </div>
                            <div onclick="ShowIcon(this)" id="2" class="IconBox">
                                <img src="~/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png" />
                                <span>防伪</span>
                            </div>
                            <div onclick="ShowIcon(this)" id="3" class="IconBox">
                                <img src="~/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png" />
                                <span>按钮名</span>
                            </div>
                            <div onclick="ShowIcon(this)" id="4" class="IconBox">
                                <img src="~/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png" />
                                <span>按钮名</span>
                            </div>
                        </div>
                        <div id="phoneForm" class="PaddingRow padding-top-15" onclick="ShowAntiFakeInp()">
                            <div class="row margin-bottom-10">
                                <input class="form-control" type="text" id="CodeSearch" />
                            </div>

                            <button type="button" class="btn btn-primary" style="width:100%" onclick="">点击查询</button>
                        </div>
                        @*<div class="PaddingRow padding-top-15" style=" height:23%">
                                <div style="width:100%;height:100%;overflow-y:auto;">
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                    111<br />
                                </div>
                            </div>*@

                        <a class="surport">码管家云系统提供技术支持</a>
                    </div>
                </div>
            </div>
        </div>

        <div class="right-con">
            <div class="tab-content" style="margin-top:15px;" id="level2-content">
                <!-----------------------------标题管理-------------------------------------->
                <div id="AntiFakeTitle" class="rightForm" role="tabpanel">
                    <p class="titleCss">标题管理<span class="titleX">×</span></p>
                    <form id="activity_form" class="form-horizontal" onkeydown="if(event.keyCode==13){return false;}">
                        <div class="row">
                            <div class="col-xs-2 col-md-2 text-right">
                                标题名称：
                            </div>
                            <div class="col-xs-5 col-md-5">
                                <input type="text" class="form-control" name="TitleName" oninput="changeTitleName(this)">
                            </div>
                        </div>

                        <div class="row text-right margin-right-30">
                            <button id="TitleSave" type="button" class="btn btn-primary">保存</button>
                        </div>
                    </form>
                </div>
                <!-----------------------------轮播图管理-------------------------------------->
                <div id="AntiFakeSwiper" class="rightForm" role="tabpanel">
                    <p class="titleCss">轮播图管理<span class="titleX">×</span></p>
                    <form id="delivery_form" class="form-horizontal" onkeydown="if(event.keyCode==13){return false;}">
                        @*<div class="row">
                <div class="col-md-2 text-right">显示方式：</div>
                <div class="col-md-4">
                    <label for="multipleImg">
                        <input type="radio" id="multipleImg" name="swiperShow" value="0" checked="checked">&nbsp;轮播
                    </label>
                    &nbsp;&nbsp;
                    <label for="singleImg">
                        <input type="radio" id="singleImg" name="swiperShow" value="1">&nbsp;单图
                    </label>
                </div>
            </div>*@
                        <div class="row">
                            <div class="col-md-2 text-right">轮播设置：</div>
                            <div class="col-md-5">
                                <select class="form-control" name="swpierAutoplay" onchange="swpierAutoplayNum(this)">
                                    <option value="1">1秒</option>
                                    <option value="2">2秒</option>
                                    <option value="3" selected="selected">3秒</option>
                                    <option value="4">4秒</option>
                                    <option value="5">5秒</option>
                                </select>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">
                                上传图片：
                            </div>
                            <div class="col-xs-10 col-sm-10 col-md-10 col-lg-10">
                                <div class="hello">
                                    <div class="upload">
                                        <div class="upload_warp">
                                            <div class="upload_warp_left" id="SwpierImgAdd">
                                                <img src="~/Content/webImgs/AntiFakePage/upload.png">
                                            </div>
                                            <div class="upload_warp_right">
                                                <div class="upload_warp_img">
                                                    @*<div class="upload_warp_img_div">
                                            <div class="upload_warp_img_div_top">
                                                <img src="~/Content/webImgs/AntiFakePage/del.png" class="upload_warp_img_div_del">
                                            </div>
                                            <div class="upload_warp_img_div_text">
                                                <img src="~/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png" />
                                            </div>
                                        </div>*@
                                                </div>
                                            </div>
                                        </div>
                                        <div class="upload_warp_text">选中1张文件 图片大小建议：640x320px 最多上传5张</div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row text-right margin-right-30">
                            <button id="LunBoTuSave" type="button" class="btn btn-primary">保存</button>
                        </div>
                    </form>
                </div>
                <!-----------------------------按钮管理-------------------------------------->
                <div id="AntiFakeBtn_1" class="rightForm AntiFakeBtn">
                    <p class="titleCss">按钮管理<span class="titleX">×</span></p>
                    <form id="AntiFakeBtn_form" class="tab-pane fade active  in form-horizontal">

                        <input type="hidden" name="Id" value="1"/>

                        <div class="row">
                            <div class="col-xs-2 col-md-2 text-right">
                                按钮名称：
                            </div>
                            <div class="col-xs-5 col-md-5">
                                <input type="text" class="form-control" value="溯源" name="IconTitleName">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">显示方式：</div>
                            <div class="col-md-6">
                                <label for="Notnum">
                                    <input id="Notnum" type="radio" name="Icon_0" value="0" checked="checked" onclick="ChangeIcon0Img(this)">默认图标
                                </label>
                                &nbsp;&nbsp;
                                <label for="num">
                                    <input id="num" type="radio" name="Icon_0" value="1" onclick="ChangeIcon0Img(this)">自定义图标
                                </label>
                                &nbsp;&nbsp;
                                <div class="hello" style="padding-left:15px;display:none" id="Icon0File">
                                    <div class="upload">
                                        <div id="Icon0list" class="uploader-list" style="display:flex;align-items:center">
                                            <label id="Icon0Img" class="HoverImg" style="background: url('/Content/webImgs/upLogo/cp_img_tj.png' );background-size:100% 100%;width:40px;height:40px;border-radius:5px;background-repeat:no-repeat"></label>
                                            <span>（建议上传40*40px的图片）</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">链接地址：</div>
                            <div class="col-md-8">
                                <label>
                                    <input type="radio" name="iconLink" value="0" checked="checked">
                                    &nbsp;
                                    防伪查询
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="1">
                                    &nbsp;
                                    全程溯源
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="2" onclick="$.MGJ.DiamondEdition.Dialog_SelectAuthList()">
                                    &nbsp;
                                    绑定企业认证
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="3">
                                    &nbsp;
                                    企业介绍
                                </label>
                            </div>
                            <input type="hidden" name="BindValue" />
                        </div>

                        <div class="row text-right margin-right-30">
                            <button id="ButtonSave" type="button" class="btn btn-primary iconBtn" data-id="1">保存</button>
                        </div>
                    </form>
                </div>
                <div id="AntiFakeBtn_2" class="rightForm AntiFakeBtn">
                    <p class="titleCss">按钮管理<span class="titleX">×</span></p>
                    <form id="AntiFakeBtn_form" class="tab-pane fade active  in form-horizontal">
                        <input type="hidden" name="Id" value="2" />


                        <div class="row">
                            <div class="col-xs-2 col-md-2 text-right">
                                按钮名称：
                            </div>
                            <div class="col-xs-5 col-md-5">
                                <input type="text" class="form-control" value="防伪" name="IconTitleName">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">显示方式：</div>
                            <div class="col-md-6">
                                <input type="radio" name="Icon_1" value="0" checked="checked" onclick="ChangeIcon1Img(this)">
                                &nbsp;
                                <label for="Notnum">默认图标</label>
                                &nbsp;  &nbsp;
                                <input type="radio" name="Icon_1" value="1" onclick="ChangeIcon1Img(this)">
                                &nbsp;
                                <label for="num">自定义图标</label>
                                <div class="hello" style="padding-left:15px;display:none" id="Icon1File">
                                    <div class="upload">
                                        <div id="Icon1list" class="uploader-list" style="display:flex;align-items:center">
                                            <label id="Icon1Img" class="HoverImg" style="background: url('/Content/webImgs/upLogo/cp_img_tj.png' );background-size:100% 100%;width:40px;height:40px;border-radius:5px;background-repeat:no-repeat"></label>
                                            <span>（建议上传40*40px的图片）</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">链接地址：</div>
                            <div class="col-md-8">
                                <label>
                                    <input type="radio" name="iconLink" value="0" checked="checked">
                                    &nbsp;
                                    防伪查询
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="1">
                                    &nbsp;
                                    全程溯源
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="2" onclick="$.MGJ.DiamondEdition.Dialog_SelectAuthList()">
                                    &nbsp;
                                    绑定企业认证
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="3">
                                    &nbsp;
                                    企业介绍
                                </label>
                            </div>
                            <input type="hidden" name="BindValue" />
                        </div>

                        <div class="row text-right margin-right-30">
                            <button type="button" class="btn btn-primary iconBtn" data-id="2">保存</button>
                        </div>
                    </form>
                </div>
                <div id="AntiFakeBtn_3" class="rightForm AntiFakeBtn">
                    <p class="titleCss">按钮管理<span class="titleX">×</span></p>
                    <form id="AntiFakeBtn_form" class="tab-pane fade active  in form-horizontal">

                        <input type="hidden" name="Id" value="3"/>

                        <div class="row">
                            <div class="col-xs-2 col-md-2 text-right">
                                按钮名称：
                            </div>
                            <div class="col-xs-5 col-md-5">
                                <input type="text" class="form-control" name="IconTitleName" placeholder="请输入按钮名称" oninput="ChangeIconTitle(this)">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">显示方式：</div>
                            <div class="col-md-6">
                                <input type="radio" name="Icon_2" value="0" checked="checked" onclick="ChangeIcon2Img(this)">
                                &nbsp;
                                <label for="Notnum">默认图标</label>
                                &nbsp;  &nbsp;
                                <input type="radio" name="Icon_2" value="1" onclick="ChangeIcon2Img(this)">
                                &nbsp;
                                <label for="num">自定义图标</label>
                                <div class="hello" style="padding-left:15px;display:none" id="Icon2File">
                                    <div class="upload">
                                        <div id="Icon2list" class="uploader-list" style="display:flex;align-items:center">
                                            <label id="Icon2Img" class="HoverImg" style="background: url('/Content/webImgs/upLogo/cp_img_tj.png' );background-size:100% 100%;width:40px;height:40px;border-radius:5px;background-repeat:no-repeat"></label>
                                            <span>（建议上传40*40px的图片）</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">链接地址：</div>
                            <div class="col-md-8">
                                <label>
                                    <input type="radio" name="iconLink" value="0" checked="checked">
                                    &nbsp;
                                    防伪查询
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="1">
                                    &nbsp;
                                    全程溯源
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="2" onclick="$.MGJ.DiamondEdition.Dialog_SelectAuthList()">
                                    &nbsp;
                                    绑定企业认证
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="3">
                                    &nbsp;
                                    企业介绍
                                </label>
                            </div>
                            <input type="hidden" name="BindValue" />
                        </div>

                        <div class="row text-right margin-right-30">
                            <button type="button" class="btn btn-primary iconBtn" data-id="3">保存</button>
                        </div>
                    </form>
                </div>
                <div id="AntiFakeBtn_4" class="rightForm AntiFakeBtn">
                    <p class="titleCss">按钮管理<span class="titleX">×</span></p>
                    <form id="AntiFakeBtn_form" role="tabpanel" class="tab-pane fade active  in form-horizontal">
                        <input type="hidden" name="Id" value="4"/>

                        <div class="row">
                            <div class="col-xs-2 col-md-2 text-right">
                                按钮名称：
                            </div>
                            <div class="col-xs-5 col-md-5">
                                <input type="text" class="form-control" name="IconTitleName" placeholder="请输入按钮名称" oninput="ChangeIconTitle(this)">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">显示方式：</div>
                            <div class="col-md-6">
                                <label>
                                    <input type="radio" name="Icon_3" value="0" checked="checked" onclick="ChangeIcon3Img(this)">
                                    &nbsp;
                                    默认图标
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="Icon_3" value="1" onclick="ChangeIcon3Img(this)">
                                    &nbsp;
                                    自定义图标
                                </label>
                                <div class="hello" style="padding-left:15px;display:none" id="Icon3File">
                                    <div class="upload">
                                        <div id="Icon3list" class="uploader-list" style="display:flex;align-items:center">
                                            <label id="Icon3Img" class="HoverImg" style="background: url('/Content/webImgs/upLogo/cp_img_tj.png' );background-size:100% 100%;width:40px;height:40px;border-radius:5px;background-repeat:no-repeat"></label>
                                            <span>（建议上传40*40px的图片）</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 text-right">链接地址：</div>
                            <div class="col-md-8">
                                <label>
                                    <input type="radio" name="iconLink" value="0" checked="checked">
                                    &nbsp;
                                    防伪查询
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="1">
                                    &nbsp;
                                    全程溯源
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="2" onclick="$.MGJ.DiamondEdition.Dialog_SelectAuthList()">
                                    &nbsp;
                                    绑定企业认证
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="iconLink" value="3">
                                    &nbsp;
                                    企业介绍
                                </label>
                            </div>
                            <input type="hidden" name="BindValue" />
                        </div>

                        <div class="row text-right margin-right-30">
                            <button type="button" class="btn btn-primary iconBtn" data-id="4">保存</button>
                        </div>
                    </form>
                </div>
                <!-----------------------------输入框管理-------------------------------------->
                <div id="AntiFakeInp" class="rightForm" role="tabpanel">
                    <p class="titleCss">输入框管理<span class="titleX">×</span></p>
                    <form id="inputType" class="tab-content" style="margin-top:10px;">
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-sm-2 col-md-2 text-left">
                                    <label>
                                        <input type="radio" name="FWCode" checked="checked" onclick="ChangeInput(this)" />单防伪
                                    </label>
                                </div>
                                <div class="col-xs-5 col-md-5">
                                    <input class="form-control" type="text" readonly="readonly" placeholder="防伪码输入框" value=" " />
                                </div>
                            </div>
                        </div>
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-sm-2 col-md-2 text-left">
                                    <label>
                                        <input type="radio" name="FWCode" onclick="ChangeInput(this)" />溯源+防伪
                                    </label>
                                </div>
                                <div class="col-xs-3 col-md-3" style="padding-right:0;">
                                    <input class="form-control" type="text" readonly="readonly" placeholder="溯源码输入框" style="border-bottom-right-radius: 0px !important; border-top-right-radius: 0px !important;">
                                </div>
                                <div class="col-sm-2 col-md-2">
                                    <span style="background: #EEE; text-align: center; padding: 0; border-bottom-right-radius: 4px; border-top-right-radius: 4px; display: flex; align-items: center; justify-content: space-around; line-height: 2.3em;margin-left:-15px;">4位验证码</span>
                                </div>
                            </div>
                        </div>

                        <div class="row text-right margin-right-30">
                            <button type="button" class="btn btn-primary" >保存</button>
                        </div>
                    </form>
                </div>
                <!-----------------------------富文本框管理-------------------------------------->
                @*<div id="AntiFakeRichText" role="tabpanel" class="tab-pane fade in">

                        <form id="activityInfo_form" class="tab-content" style="margin-top:10px;">
                            <div class="row">
                                <div class="tdtxt">正文内容：</div>
                                <div class="tdbox">
                                    <script id="editor" type="text/plain"></script>
                                </div>
                            </div>
                        </form>
                    </div>*@
                <!-----------------------------拖动img管理-------------------------------------->
                <div id="AntiFakeDragImg" class="rightForm" role="tabpanel">
                    <p class="titleCss">更换拖动图<span class="titleX">×</span></p>
                    <form id="" class="tab-content" style="margin-top:10px;">
                        <div class="row">

                            <div class="col-xs-5 col-md-5">
                                <label>
                                    <input type="radio" name="BackgroundInp" value="0" checked="checked" onclick="DragImgShow(this)">
                                    &nbsp;上传图片
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="BackgroundInp" value="1" onclick="DragImgShow(this)">
                                    &nbsp;隐藏
                                </label>
                            </div>
                        </div>
                        <div class="hello" style="padding-left:15px;" id="DragImgFile">
                            <div class="upload">

                                <div id="DragImg_Web" class="uploader-list" style="display:flex;align-items:center">
                                    <label id="DragImgWebUp" class="HoverImg" style="background: url('/Content/webImgs/upLogo/cp_img_tj.png' );background-size:100% 100%;width:91px;height:91px;border-radius:5px;background-repeat:no-repeat"></label>
                                    @*<span>（建议上传350*667px的图片）</span>*@

                                </div>

                            </div>
                        </div>

                        <div class="row text-right margin-right-30">
                            <button type="button" id="DragImgSave" class="btn btn-primary" >保存</button>
                        </div>
                    </form>
                </div>



                <!-----------------------------背景管理-------------------------------------->
                <div id="AntiFakeBackground" class="rightForm" role="tabpanel">
                    <p class="titleCss">更换背景<span class="titleX">×</span></p>
                    <form id="activityInfo_form" class="tab-content" style="margin-top:10px;">
                        <div class="row">

                            <div class="col-xs-5 col-md-5">
                                <label>
                                    <input type="radio" name="BackgroundInp" value="0" checked="checked" onclick="ChangeBackgroundImg(this)">
                                    &nbsp;默认
                                </label>
                                &nbsp;  &nbsp;
                                <label>
                                    <input type="radio" name="BackgroundInp" value="1" onclick="ChangeBackgroundImg(this)">
                                    &nbsp;
                                    上传背景图
                                </label>
                            </div>
                        </div>
                        <div class="hello" style="padding-left:15px;display:none" id="BackgroundFile">
                            <div class="upload">

                                <div id="thelist" class="uploader-list" style="display:flex;align-items:center">
                                    <label id="backgroundImg" class="HoverImg" style="background: url('/Content/webImgs/upLogo/cp_img_tj.png' );background-size:100% 100%;width:91px;height:91px;border-radius:5px;background-repeat:no-repeat"></label>
                                    <span>（建议上传350*667px的图片）</span>

                                </div>
                            </div>
                        </div>

                        <div class="row text-right margin-right-30">
                            <button type="button" id="BackgroundImgSave" class="btn btn-primary">保存</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

    </div>
</div>

@*模态框（Modal）*@
@*<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width:800px;border-radius:6px;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">编辑图片</h4>
                </div>
                <div class="modal-body row" style="display:flex;align-items:center;">
                    <div class="col-sm-5" style="display:flex;justify-content:center" id="showImg">
                        <img src="" id="ModalImg" class="img-thumbnail" />
                    </div>
                    <label class="btn btn-success picker" id="picker">
                        上传替换
                    </label>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal" aria-hidden="true">关闭</button>
                </div>
            </div>
        </div>
    </div>*@

<script>
    var Icon0Index = 0;
    var Icon0Src = "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png";
    var Icon1Index = 0;
    var Icon1Src = "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png";
    var Icon2Index = 0;
    var Icon2Src = "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png";
    var Icon3Index = 0;
    var Icon3Src = "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png";
    var defaultIconSrc = "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png";
    var defaultSwiperSrc = "/Scripts/MGJJS/TraceSource/PageOperation/UEditor/dialogs/image/images/alignicon.jpg";
    var SwpierPlayNum = 3;
    var SwpierDefaultImageHtml = '<img class="swiper-slide SwpierDefaultImage" src="/Scripts/MGJJS/TraceSource/PageOperation/UEditor/dialogs/image/images/alignicon.jpg" />'
    var DragDefaultImageSrc = "/Content/CommonCss/miniui/themes/ext/images/index_48.jpg"

    var DragImgModel = function () {
        this.width = 0;
        this.height = 0;
        this.left = 0;
        this.top = 0;
        this.src = "default";
    }

    //Webuploader

    var Icon0Web, Icon1Web, Icon2Web, Icon3Web, Icon4Web, BackgroundWeb, mySwiperWeb, mySwiper,dragImgWeb;
    function UpIcon0() {
        Icon0Web.upload();
    }

    function UpIcon1() {
        Icon1Web.upload();
    }
    function UpIcon2() {
        Icon2Web.upload();
    }
    function UpIcon3() {
        Icon3Web.upload();
    }
   
    

        //按钮1
        Icon1Web = WebUploader.create({

            // swf文件路径
            //        swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: "Upload/Upload",

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: '#Icon1Img',
                multiple: false
            },
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: false,//不启用压缩
            resize: false,//尺寸不改变
        });
        // 当有文件添加进来的时候
        Icon1Web.on('fileQueued', function (file) {

            var $li = $(
                        '<div  id="' + file.id + '" class="img-thumbnail">' +
                        '<img alt="null"/>' +
    //                        '<p class="info">' + file.name + '</p>' +
                        '</div>'
                    ),
                    $img = $li.find('img');

            // $list为容器jQuery实例
            $('#Icon1list').prepend($li);

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            Icon1Web.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }
            }, 40, 40);
            $('#Icon1list > .img-thumbnail').eq(0).mouseenter(function () {
                var url = $(this).find('img').attr('src');
                $(this).attr('name', url).find('img').attr('src', "/Content/webImgs/upLogo/cp_img_sc.png");
            }).mouseleave(function () {
                var url = $(this).attr('name');
                $(this).find('img').attr('src', url);
            }).click(function () {
                $(".IconBox").eq(1).find("img").prop("src", "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png")
                Icon1Src = defaultIconSrc;
                $(this).remove();
                $('#Icon1Img').css('display', 'inline-block');
            });
            Icon1Web.upload();

            $('#Icon1Img').css('display', 'none');

            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            Icon1Web.on('uploadSuccess', function (file, response) {
                var src = response._raw.substring(response._raw.indexOf("。") + 1)
                $('#AntiFakeBtn_2 form').append(' <input type="hidden" name="IcoUrl" value="' + response._raw.split('。')[1] + '" />');
                $img.attr('src', src);
                $(".IconBox").eq(1).find("img").prop("src", src)
                Icon1Src = src
            });
        });
        // 文件上传失败，显示上传出错。
        Icon1Web.on('uploadError', function (file) {
            var $li = $('#' + file.id),
                    $error = $li.find('div.error');
            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
            }
            $error.text('上传失败');
            $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
        });
        // 完成上传完了，成功或者失败，先删除进度条。
        Icon1Web.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });

        //按钮2
        Icon2Web = WebUploader.create({

            // swf文件路径
            //        swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: "Upload/Upload",

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: '#Icon2Img',
                multiple: false
            },
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: false,//不启用压缩
            resize: false,//尺寸不改变
        });
        // 当有文件添加进来的时候
        Icon2Web.on('fileQueued', function (file) {

            var $li = $(
                        '<div  id="' + file.id + '" class="img-thumbnail">' +
                        '<img alt="null"/>' +
    //                        '<p class="info">' + file.name + '</p>' +
                        '</div>'
                    ),
                    $img = $li.find('img');

            // $list为容器jQuery实例
            $('#Icon2list').prepend($li);

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            Icon2Web.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }
            }, 40, 40);
            $('#Icon2list > .img-thumbnail').eq(0).mouseenter(function () {
                var url = $(this).find('img').attr('src');
                $(this).attr('name', url).find('img').attr('src', "/Content/webImgs/upLogo/cp_img_sc.png");
            }).mouseleave(function () {
                var url = $(this).attr('name');
                $(this).find('img').attr('src', url);
            }).click(function () {
                $(".IconBox").eq(2).find("img").prop("src", "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png")
                Icon2Src = defaultIconSrc;
                $(this).remove();
                $('#Icon2Img').css('display', 'inline-block');
            });
            Icon2Web.upload();

            $('#Icon2Img').css('display', 'none');
            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            Icon2Web.on('uploadSuccess', function (file, response) {
                var src = response._raw.substring(response._raw.indexOf("。") + 1)
                $('#AntiFakeBtn_3 form').append(' <input type="hidden" name="IcoUrl" value="' + response._raw.split('。')[1] + '" />');
                $img.attr('src', src);
                $(".IconBox").eq(2).find("img").prop("src", src)
                Icon2Src = src
            });
        });
        // 文件上传失败，显示上传出错。
        Icon2Web.on('uploadError', function (file) {
            var $li = $('#' + file.id),
                    $error = $li.find('div.error');
            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
            }
            $error.text('上传失败');
            $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
        });
        // 完成上传完了，成功或者失败，先删除进度条。
        Icon2Web.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });

        //按钮3
        var Icon3Web = WebUploader.create({

            // swf文件路径
            //        swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: "Upload/Upload",
            
            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: '#Icon3Img',
                multiple: false
            },
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: false,//不启用压缩
            resize: false,//尺寸不改变
        });
        // 当有文件添加进来的时候
        Icon3Web.on('fileQueued', function (file) {

            var $li = $(
                        '<div  id="' + file.id + '" class="img-thumbnail">' +
                        '<img alt="null"/>' +
    //                        '<p class="info">' + file.name + '</p>' +
                        '</div>'
                    ),
            $img = $li.find('img');

            // $list为容器jQuery实例
            $('#Icon3list').prepend($li);

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            Icon3Web.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }

                
            }, 40, 40);
            $('#Icon3list > .img-thumbnail').eq(0).mouseenter(function () {
                var url = $(this).find('img').attr('src');
                $(this).attr('name', url).find('img').attr('src', "/Content/webImgs/upLogo/cp_img_sc.png");
            }).mouseleave(function () {
                var url = $(this).attr('name');
                $(this).find('img').attr('src', url);
            }).click(function () {
                $(".IconBox").eq(3).find("img").prop("src", "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png")
                Icon3Src = defaultIconSrc;
                $(this).remove();
                $('#Icon3Img').css('display', 'inline-block');
            });

            $('#Icon3Img').css('display', 'none');
            Icon3Web.upload();

            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            Icon3Web.on('uploadSuccess', function (file, response) {
                var src = response._raw.substring(response._raw.indexOf("。") + 1)
                $('#AntiFakeBtn_4 form').append(' <input type="hidden" name="IcoUrl" value="' + response._raw.split('。')[1] + '" />');
                $img.attr('src', src);
                $(".IconBox").eq(3).find("img").prop("src", src)
                Icon3Src = src
            });

        });
        
        // 文件上传失败，显示上传出错。
        Icon3Web.on('uploadError', function (file) {
            var $li = $('#' + file.id),
                    $error = $li.find('div.error');
            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
            }
            $error.text('上传失败');
            $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
        });
        // 完成上传完了，成功或者失败，先删除进度条。
        Icon3Web.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });

        
        $('.HoverImg').mouseenter(function () {
            $(this).css('background-image', 'url("/Content/webImgs/upLogo/cp_img_tj_a.png")');

        }).mouseleave(function () {
            $(this).css('background-image', 'url("/Content/webImgs/upLogo/cp_img_tj.png")');
        });
        function UpBackground()
        { BackgroundWeb.upload(); }


    //背景
        BackgroundWeb = WebUploader.create({

            // swf文件路径
            //        swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: "Upload/Upload",

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: "#backgroundImg",
                multiple: false
            },
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: false,//不启用压缩
            resize: false,//尺寸不改变
        });
        // 当有文件添加进来的时候
        BackgroundWeb.on('fileQueued', function (file) {

            var $li = $(
                        '<div  id="' + file.id + '" class="img-thumbnail">' +
                        '<img alt="null"/>' +
//                        '<p class="info">' + file.name + '</p>' +
                        '</div>'
                    ),
                    $img = $li.find('img');

            // $list为容器jQuery实例
            $('#thelist').prepend($li);

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            BackgroundWeb.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }
                
            }, 91, 91);
            $('#thelist > .img-thumbnail').eq(0).mouseenter(function () {
                var url = $(this).find('img').attr('src');
                $(this).attr('name', url).find('img').attr('src', "/Content/webImgs/upLogo/cp_img_sc.png");
            }).mouseleave(function () {
                var url = $(this).attr('name');
                $(this).find('img').attr('src', url);
            }).click(function () {
                $("#phone").css("background-image", "none")
                BackgroundSrc = "";
                $(this).remove();
                $('#backgroundImg').css('display', 'inline-block');
            });

            $('#backgroundImg').css('display', 'none');
            BackgroundWeb.upload();

            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            BackgroundWeb.on('uploadSuccess', function (file, response) {
                $('#activityInfo_form').append(' <input type="hidden" name="BImg" id="BImg" value="' + response._raw.split('。')[1] + '" />')

                var src = response._raw.substring(response._raw.indexOf("。") + 1)
                $img.attr('src', src);

                $("#phone").css({ "background-image": "url(" + src + ")" })
                BackgroundSrc = src
            });
        });

        

        // 文件上传失败，显示上传出错。
        BackgroundWeb.on('uploadError', function (file) {
            var $li = $('#' + file.id),
                    $error = $li.find('div.error');
            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
            }
            $error.text('上传失败');
            $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        BackgroundWeb.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });

        
        
        //按钮0
        Icon0Web = WebUploader.create({

            // swf文件路径
            //        swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: "Upload/Upload",

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: '#Icon0Img',
                multiple: false
            },
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: false,//不启用压缩
            resize: false,//尺寸不改变
        });
        // 当有文件添加进来的时候
        Icon0Web.on('fileQueued', function (file) {

            var $li = $(
                        '<div  id="' + file.id + '" class="img-thumbnail">' +
                        '<img alt="null"/>' +
//                        '<p class="info">' + file.name + '</p>' +
                        '</div>'
                    ),
                    $img = $li.find('img');

            // $list为容器jQuery实例
            $('#Icon0list').prepend($li);

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            Icon0Web.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }
            }, 40, 40);
            $('#Icon0list > .img-thumbnail').eq(0).mouseenter(function () {
                var url = $(this).find('img').attr('src');
                $(this).attr('name', url).find('img').attr('src', "/Content/webImgs/upLogo/cp_img_sc.png");
            }).mouseleave(function () {
                var url = $(this).attr('name');
                $(this).find('img').attr('src', url);
            }).click(function () {
                $(".IconBox").eq(0).find("img").prop("src", "/Content/webImgs/TraceSource/OriginsMaterialList/Icon_Gold.png")
                Icon0Src = defaultIconSrc;
                $(this).remove();
                $('#Icon0Img').css('display', 'inline-block');
            });

            $('#Icon0Img').css('display', 'none');
            Icon0Web.upload();
            

            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            Icon0Web.on('uploadSuccess', function (file, response) {
                $('#AntiFakeBtn_1 form').append(' <input type="hidden" name="IcoUrl" value="' + response._raw.split('。')[1] + '" />');

                var src = response._raw.substring(response._raw.indexOf("。") + 1)
                $img.attr('src', src);
                $(".IconBox").eq(0).find("img").prop("src", src)
                Icon0Src = src

            });
        });


        // 文件上传失败，显示上传出错。
        Icon0Web.on('uploadError', function (file) {
            var $li = $('#' + file.id),
                    $error = $li.find('div.error');
            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
            }
            $error.text('上传失败');
            $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        Icon0Web.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });

       
        //拖动图
        dragImgWeb = WebUploader.create({

            // swf文件路径
            //        swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: "Upload/Upload",

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: "#DragImgWebUp",
                multiple: false
            },
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: false,//不启用压缩
            resize: false,//尺寸不改变
        });
        // 当有文件添加进来的时候
        dragImgWeb.on('fileQueued', function (file) {

            var $li = $(
                        '<div  id="' + file.id + '" class="img-thumbnail">' +
                        '<img alt="null"/>' +
//                        '<p class="info">' + file.name + '</p>' +
                        '</div>'
                    ),
                    $img = $li.find('img');

            // $list为容器jQuery实例
            $('#DragImg_Web').prepend($li);
            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            dragImgWeb.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }
            }, 91, 91);
            $('#DragImg_Web > .img-thumbnail').eq(0).mouseenter(function () {
                var url = $(this).find('img').attr('src');
                $(this).attr('name', url).find('img').attr('src', "/Content/webImgs/upLogo/cp_img_sc.png");
            }).mouseleave(function () {
                var url = $(this).attr('name');
                $(this).find('img').attr('src', url);
            }).click(function () {
                $("#DragImg").attr("src", DragDefaultImageSrc)
                $(this).remove();
                $('#DragImgWebUp').css('display', 'inline-block');
            });

            $('#DragImgWebUp').css('display', 'none');

            dragImgWeb.upload();
            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            dragImgWeb.on('uploadSuccess', function (file, response) {
                var src = response._raw.substring(response._raw.indexOf("。") + 1)
                $('#AntiFakeDragImg form').append(' <input type="hidden" name="DragImgSrc" value="' + response._raw.split('。')[1] + '" />');
                $img.attr('src', src);

                $("#DragImgWebUp").attr("src", src)
                $("#DragImg").attr("src", src)
            });

           
        });
      

        // 文件上传失败，显示上传出错。
        dragImgWeb.on('uploadError', function (file) {
            var $li = $('#' + file.id),
                    $error = $li.find('div.error');
            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
            }
            $error.text('上传失败');
            $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        dragImgWeb.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });

        //swpier

        mySwiper = new Swiper('#top_img', {
            autoplayDisableOnInteraction: false,
            //width: window.innerWidth,
            pagination: '.swiper-pagination',
            paginationClickable: true,
            //loop: true,
            autoplay: SwpierPlayNum * 1000,
        });
        mySwiperWeb = WebUploader.create({

            // swf文件路径
            //        swf: BASE_URL + '/js/Uploader.swf',

            // 文件接收服务端。
            server: "Upload/Upload",

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: '#SwpierImgAdd',
                multiple: true
            },
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: null,//不启用压缩
            resize: false,//尺寸不改变

        });
        // 当有文件添加进来的时候
        mySwiperWeb.on('fileQueued', function (file) {
            var $li = $(
                 '<div class="upload_warp_img_div" id="' + file.id + '">' +
                    '<div class="upload_warp_img_div_top">' +
                        '<img src="/Content/webImgs/AntiFakePage/del.png" class="upload_warp_img_div_del" onclick="delSwpierImg(this)">' +
                    '</div>' +
                    '<div class="upload_warp_img_div_text">' +
                        '<img alt="null" class="uploadImg" />' +
                   '</div>' +
                '</div>');
                $img = $li.find('.uploadImg')
            // $list为容器jQuery实例
            $('.upload_warp_img').append($li);

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            mySwiperWeb.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }
                mySwiper.update();

            });


            mySwiperWeb.upload();

            

        });

        // 文件上传成功，给item添加成功class, 用样式标记上传成功。
        mySwiperWeb.on('uploadSuccess', function (file, response) {
            //$.L.msgSuccess("操作成功");

            //console.log(response._raw.split('。')[1]);
            //console.log(file);
            $('#delivery_form').append(' <input type="hidden" name="UrlImg' + file.id.split("_")[2] + '" value="' + response._raw.split('。')[1] + '" />')
            var src = response._raw.substring(response._raw.indexOf("。") + 1)
            $img.attr('src', src);
            $swpierImg = '<img class="swiper-slide addSwpierImg" src="' + src + '" />'
   
            $("#_top_img").append($swpierImg)
            ShowDefaultImg($(".upload_warp_img_div").length)
        });

        
        // 文件上传失败，显示上传出错。
        mySwiperWeb.on('uploadError', function (file, r) {
            //console.log(file)
            var $li = $('#' + file.id),
                    $error = $li.find('div.error');
            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
            }
            $error.text('上传失败');
            $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
        });
        // 完成上传完了，成功或者失败，先删除进度条。
        mySwiperWeb.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });


        //拖动图
        function ShowDragImg(e) {
            $(".rightForm").hide();
            $("#AntiFakeDragImg").show()
            if (e && e.stopPropagation) {
                e.stopPropagation()
            } else {
                window.event.cancelBubble = true;
            }
        }

        function DragImgShow(_this, e) {
            if($(_this).val()==0){
                $("#DragImgFile").show();
                $("#DragImgUiBox").show();
                $("#DragImgHideBox").hide()
            }else{
                $("#DragImgFile").hide();
                $("#DragImgUiBox").hide();
                $("#DragImgHideBox").show()
            }
            //if (e && e.stopPropagation) {
            //    e.stopPropagation()
            //} else {
            //    window.event.cancelBubble = true;
            //}
        }
        
    //标题
    function ShowTitle(e) {
        $(".rightForm").hide();
        $("#AntiFakeTitle").show()
        $("input[name='TitleName']").focus();
        if (e && e.stopPropagation) {
            e.stopPropagation()
        } else {
            window.event.cancelBubble = true;
        }
    }
    function changeTitleName(_this) {
        $(".pageTitle").text($(_this).val())
    }

    //swiper
    function ShowTopSwpier(e) {
        $(".rightForm").hide();
        $("#AntiFakeSwiper").show();
        if (e && e.stopPropagation) {
            e.stopPropagation()
        } else {
            window.event.cancelBubble = true;
        }
    }

    function swpierAutoplayNum(_this) {
        SwpierPlayNum = $(_this).val();
        //console.log(parseFloat(SwpierPlayNum) * 1000)
        mySwiper.params.autoplay = parseFloat(SwpierPlayNum) * 1000;
    }

    function delSwpierImg(_this) {

        var index = $(".upload_warp_img_div_del").index($(_this))
        $(_this).parents('.upload_warp_img_div').remove();
        $(".addSwpierImg").eq(index).remove()
        ShowDefaultImg($(".upload_warp_img_div").length)

        mySwiper.update()
    }
    function ShowDefaultImg(nub) {
    
        if (nub > 0) {
            if ((".SwpierDefaultImage").length > 0) $(".SwpierDefaultImage").remove();

            if (nub == 1) {
                $("#btn1").hide();
                mySwiper.params.autoplay = 0;
            } else {
                $("#btn1").show();
                mySwiper.params.autoplay = parseInt(SwpierPlayNum) * 1000;

            }

        } else {
            $("#_top_img").append(SwpierDefaultImageHtml)
        }
        mySwiper.update();
    }

    //按钮

    function ShowIcon(_this, e) {
        var index = $(".IconBox").index($(_this))


        $(".rightForm").hide();
        $(".AntiFakeBtn").eq(index).show().find('input[name="IconTitleName"]')
        $(".iconBtn").eq(index).attr("iconID", $(_this).attr("id"))
        if (e && e.stopPropagation) {
            e.stopPropagation()
        } else {
            window.event.cancelBubble = true;
        }
    }
    function ChangeIconTitle(_this) {
        var index = $("input[name='IconTitleName']").index($(_this))
        $(".IconBox").eq(index).find("span").text($(_this).val())
    }
    function ChangeIcon0Img(_this) {
        Icon0Index = $("input[name='Icon_0']").index($(_this))
        if (Icon0Index == 0) {
            $(".IconBox").eq(0).find("img").prop("src", defaultIconSrc)
            $("#Icon0File").hide()
        } else {
            $(".IconBox").eq(0).find("img").prop("src", Icon0Src)
            $("#Icon0File").show()
        }
    }
    function ChangeIcon1Img(_this) {
        Icon1Index = $("input[name='Icon_1']").index($(_this))
        if (Icon1Index == 0) {
            $(".IconBox").eq(1).find("img").prop("src", defaultIconSrc)
            $("#Icon1File").hide()
        } else {
            $(".IconBox").eq(1).find("img").prop("src", Icon1Src)
            $("#Icon1File").show()
        }
    }
    function ChangeIcon2Img(_this) {
        Icon2Index = $("input[name='Icon_2']").index($(_this))
        if (Icon2Index == 0) {
            $(".IconBox").eq(2).find("img").prop("src", defaultIconSrc)
            $("#Icon2File").hide()
        } else {
            $(".IconBox").eq(2).find("img").prop("src", Icon2Src)
            $("#Icon2File").show()
        }
    }
    function ChangeIcon3Img(_this) {
        Icon3Index = $("input[name='Icon_3']").index($(_this))
        if (Icon3Index == 0) {
            $(".IconBox").eq(3).find("img").prop("src", defaultIconSrc)
            $("#Icon3File").hide()
        } else {
            $(".IconBox").eq(3).find("img").prop("src", Icon3Src)
            $("#Icon3File").show()
        }
    }

    //Input
    function ShowAntiFakeInp(e) {
        $(".rightForm").hide();
        $("#AntiFakeInp").show()
        if (e && e.stopPropagation) {
            e.stopPropagation()
        } else {
            window.event.cancelBubble = true;
        }
    }
    function ChangeInput(_this) {
        var index = $("input[name='FWCode']").index($(_this))
        switch (index) {
            case 0:
                var html = '<input class="form-control" id="CodeSearch" type="text"  placeholder="防伪码输入框" value=" ">'
                break;
            case 1:
                var html = ['<div id="CodeSearch" style="margin:0 -15px"><div class="col-xs-7 col-md-7" style="padding-right:0;">',
                            '<input class="form-control" type="text" readonly="readonly" placeholder="溯源码输入框" style="border-bottom-right-radius: 0px !important; border-top-right-radius: 0px !important;">',
                        '</div>',
                        '<div class="col-sm-5 col-md-5">',
                            '<span style="background: #EEE; text-align: center; padding: 0; border-bottom-right-radius: 4px; border-top-right-radius: 4px; display: flex; align-items: center; justify-content: space-around; line-height: 2.3em;margin-left:-15px;">4位验证码</span>',
                        '</div></div>'].join("")
                break;
        }
        $("#CodeSearch").after(html).remove()
    }

    //背景
    var BackgroundIndex = 0;
    var BackgroundSrc = "";
    function ChangeBackground() {
        $(".rightForm").hide();
        $("#AntiFakeBackground").show()
    }
    function ChangeBackgroundImg(_this) {
        BackgroundIndex = $("input[name='BackgroundInp']").index($(_this))
        if (BackgroundIndex == 0) {
            $("#phone").css("background-image", "none")
            $("#BackgroundFile").hide()
        } else {
            $("#phone").css("background-image", "url(" + BackgroundSrc + ")")
            $("#BackgroundFile").show()
        }
    }


    $(".titleX").on("click", function () {
        $(this).parents(".rightForm").hide()
    })


    $("#DragImgUiBox").draggable({ containment: "parent" }).resizable();;




    //var ue = UE.getEditor('editor');

    



</script>